<template>
    <div class="layout">
        <!--左侧导航-->
        <NavBar></NavBar>
        <div  class="layout-right">
            <HeaderView></HeaderView>
            <ContentView></ContentView>
        </div>
    </div>
</template>

<script>
    import NavBar from "@/views/common/NavBar.vue";
    import HeaderView from "@/views/common/HeaderView.vue";
    import ContentView from "@/views/common/ContentView.vue";
    export default {
        name: "MainLayout",
        components: {ContentView, HeaderView, NavBar}
    }
</script>

<style scoped>

.layout {
  display: flex;
  width: 100%;
  height: 100%;
}

.layout-right {
  display: flex;
  flex-direction: column;
  overflow: auto;
  width: 100%;
  height: 100%;
}


</style>
